﻿<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>Index</title>
		<link  rel="stylesheet" type="text/css" href="Resource/API.css"/>
		<script type="text/javascript" src="Resource/jquery.js"></script>
		<script type="text/javascript">

$(function(){
        $("#Nav").height($(document).height()-5);
		$("#Tar").height($(document).height()-5);
		$("#Nav li").click(function(){
		    $("#Tar").attr("src", ($(this).attr("tar")));
		    $("#Nav li").css({ "background": "#e5e5e5", "color": "black" });
		    $(this).css({ "background": "#2d2f2d", "color": "white" });
		});

		$("#Nav li").eq(0).click();
        

});

		</script>
	</head>
	<body>
		<div id="MainDiv">
          <ul id="Nav">
              <li tar="Page/PinPad.html">PinPad</li>
              <li tar="Page/IDCardReader.html">IDCardReader</li><!--NavHolder-->
		  </ul>
         <iframe src="" id="Tar"  />

		</div>



	
	</body>
</html>
